import React, { Component } from 'react'
import {NavBar,List,WhiteSpace,InputItem,Icon,ListView, Button,WingBlank,Modal} from 'antd-mobile'
import './main.css'


class Main extends Component {

    constructor(props) {
        super(props)
        const dataSource = new ListView.DataSource({
            rowHasChanged: (row1, row2) => row1 !== row2,
        });
        
        this.state = {
            dataSource,
            qrcode:'',
        }
    }

    componentDidMount() {
        const data = [
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
            {'orderno':'O00001', 'time':'05-06 12:11:54'},
        ]

        this.setState({
            dataSource: this.state.dataSource.cloneWithRows(data),
        });
    }

    //显示二维码扫描器，无效
    showCamera=()=>{
        console.log('展示二维码扫描器');
        this.props.history.push('/qrscan')
    }

    //点击核销按钮
    hexiaoHandle=()=>{
        Modal.alert('提示', '确认核销?',
            [
                {text:'取消', onPress:()=>console.log('cancel')},
                {text:'确认', onPress : ()=>{
                    console.log('sdf')
                }}
            ])
    }

    render() {
        return (
            <div>
                <NavBar>门店主页</NavBar>

                <List renderHeader="门店信息">
                    <List.Item extra="">上海张江店</List.Item>
                </List>

                <List renderHeader="录入核销码">
                    <InputItem
                        placeholder="输入顾客核销码"
                        type="number"
                    ></InputItem>
                    <List.Item>
                    <WhiteSpace />
                        <Button type="primary" size="small" onClick={this.hexiaoHandle}>核销服务</Button>
                    </List.Item>
                </List>

                <WhiteSpace />
                <WingBlank style={{color:'#888'}}>报销记录</WingBlank>
                <WhiteSpace />

                <div style={{position:'absolute', width:'100%', top:'300px',bottom:'5px'}}>
                <ListView
                    style={{height:'100%'}}
                    dataSource={this.state.dataSource}
                    renderRow={(row)=>(
                        <List.Item extra={row.time}>{row.orderno}</List.Item>
                    )}
                />
                </div>
            </div>
        )
    }
}

export default Main